<script setup lang="ts">
import dayjs from 'dayjs'
import routes from 'pages-generated'
import { computed } from 'vue'

interface IFrontmatter {
  title: string
  date: number
  category?: string[]
}

const filterRoutes = computed(() =>
  routes
    .filter(r => r.path !== '/')
    .sort(
      (a, b) =>
        (a.meta?.frontmatter as IFrontmatter).date -
        (b.meta?.frontmatter as IFrontmatter).date
    )
)
</script>

<template>
  <div v-for="(item, index) in filterRoutes" :key="index" text-5 leading-7 mt12>
    <a :href="item.path">{{
      (item.meta?.frontmatter as IFrontmatter).title
    }}</a>
    <p class="!leading-0" opacity-60 text-4>
      {{
        dayjs((item.meta?.frontmatter as IFrontmatter).date).format(
          'DD/MM/YYYY'
        )
      }}
    </p>
  </div>
</template>
